<template>
	<view class="u-page">
		<uv-navbar title="Clôture du compte"/>
		<image class="login-bg" src="/static/images/page-background.png" ></image>
		<view class="login-wrap">
			<image class="tip"  src="/static/images/tip.png" ></image>
			<view class="uv-m-tb-80">
				<uv-text
					class="tip-content" 
					bold
					text="Avant de supprimer votre compte, veuillez confirmer les informations suivantes pour vous assurer que la fermeture du compte se déroulera correctement." />
				
			</view>
			
			<view class="content-intro">
				<uv-steps current="99" direction="column" dot active-color="#ffffff" inactive-color="#ffffff">
					<uv-steps-item title="Assurez-vous qu'il n'y a pas de demande de prêt en cours ou de prêt impayé sur votre compte." >
						<template v-slot:icon>
							<uv-icon name="/static/images/Subtract.png" :size="12" color="#3c9cff"></uv-icon>
						</template>
					</uv-steps-item>
					<uv-divider lineColor="#F8EFDF"></uv-divider>
					<uv-steps-item 
						:customStyle="{marginTop:'10rpx',color:'#261E18'}"
						title="Si vous vous connectez à ce compte à nouveau dans les 30 jours suivants, l'annulation de la suppression du compte sera automatique."
					>
						<template v-slot:icon>
							<uv-icon name="/static/images/Subtract.png" :size="12" color="#3c9cff"></uv-icon>
						</template>
					</uv-steps-item>
				</uv-steps>
				<!-- <view class="">
					vuex_country:{{vuex_country}}
				</view>
				<view class="">
					vuex_mobile:{{vuex_mobile}}
				</view>
				<view class="">
					vuex_deviceId:{{vuex_deviceId}}
				</view>
				<view class="">
					vuex_token:{{vuex_token}}
				</view> -->
			</view>
			
			
			<view class="btns-foot">
				<view class="btn-foot">
					<view class="btn-group uv-p-30">
						
						<button class="cu-btn block bg-coffee round text-white" :loading="submitLoading" @click="handleCheck">
							Confirmer
						</button>					
					</view>
				</view>
			</view>
			
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				submitLoading:false,
				account: '',
				password: ''
			}
		},
		onShow() {
			
		},
		onLoad(options) {
			uni.$uv.vuex('vuex_country', options.country||'')
			uni.$uv.vuex('vuex_mobile', options.mobile||'')
			uni.$uv.vuex('vuex_deviceId', options.deviceId||'')
			uni.$uv.vuex('vuex_token', options.token||'')
			
			
			
		},
		mounted() {
			
		},
		methods: {
			
			handleCheck(){
				
				this.submitLoading = true;
				this.$network('/ddzsecurityddzaz/ddzjkcheckUnsubscribe',{
					mobile: this.vuex_mobile
				},()=>{
					this.submitLoading = false;
				}).then(res=>{
					if(res.code == '0000'){
						uni.navigateTo({
							url:'/pages/account/destroy-req'
						})
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none'
						})
					}
				})
			},
			
			goToAndroid(){
				// uni.$uv.toast('----触发了recWebMsg')
				// try{
					window.Android.recWebMsg("close2")
				// }catch(e){
					// console.log('---',e)
				// }
				
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	.u-page {
		width: 100%;
		height: 100vh;
		overflow: hidden;
		position: relative;
	}

	.login-bg {
		width: 100%;
		height: 100vh;
		position: absolute;
		bottom: 0;
	}

	.login-wrap {
		width: 100%;
		height: 100vh;
		position: absolute;
		top: 0;
		z-index: 2;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 100rpx 50rpx 300rpx;
		margin-top: 80rpx;
		.tip{
			width: 130rpx;
			height: 150rpx;
		}
		.tip-content{
			// padding: 50rpx 50rpx;
		}
		.content-intro{
			background-color: white;
			border-radius: 20rpx;
			width: 100%;
			padding: 40rpx 20rpx;
			
			.uv-steps-item__line{
				background: white;
			}
			.uv-steps-item__wrapper--column--dot{
				
			}
		}
		.login-form {
			width: 560rpx;

			.u-field-group {
				min-height: 100rpx;
				display: flex;
				align-items: center;
			}
		}

		.u-field-button {
			width: 100%;
		}

		.login-text {
			text-align: center;
			margin-top: 30rpx;
			text {
				font-size: 26rpx;
			}
			view {
				font-size: 48rpx;
				font-weight: 700;
			}
		}
	}
	.btn-group {
		.cu-btn {
			width: 100%;
			width: 600rpx;
			height: 96rpx;
			border-radius: 20rpx;
		}
	}
</style>